.notification-list {
	max-height: calc(22rem - 22px - 38px);
	overflow: auto;
	display: flex;
	flex-direction: column;

	.item-list {
		flex: 1;
		overflow-y: auto;
		.item {
			position: relative;
			border-radius: 2px;
			background: #2a2b32;
			line-height: 1.5rem;
			padding: 0.25rem 0.5rem;
			overflow: hidden;
			border-bottom: 1px solid #454750;
			> a {
				color: var(--color-nav-text);
			}
			&:hover {
				.actions {
					opacity: 1;
					right: 1rem;
				}
			}

			&.isMarkedMap {
				opacity: 0.5;

				.actions {
					user-select: none;
					pointer-events: none;
				}
			}

			&.confirmed {
				.title > i {
					color: green;
				}
			}

			&.rejected {
				.title > i {
					color: red;
				}
			}
			.mw13rem {
				max-width: 13rem;
			}
			.title {
				color: inherit;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: pre;
				&:hover {
					color: var(--color-primary);
				}
				.point {
					width: 0.25rem;
					height: 0.25rem;
					position: absolute;
					background: #ed3f37;
					border-radius: 50%;
					margin-left: -7px;
					margin-top: 0.5rem;
				}
			}

			.metadata {
				display: flex;
				justify-content: space-between;
				font-size: var(--text-sm);
				color: inherit;
				line-height: ;
			}

			.actions {
				position: absolute;
				bottom: 0;
				right: -3rem;
				height: 100%;
				transition: all 0.5s ease;
				display: flex;
				align-items: center;
				.action {
					flex: 1;
					cursor: pointer;
					display: flex;
					align-items: center;
					justify-content: center;
					color: #4b94de;
					user-select: none;

					&:not(:first-child) {
						border-left: 1px solid var(--color-bg-3);
					}

					& > svg {
						fill: currentColor;
						margin-right: 0.25rem;
						width: var(--text-md);
						font-size: var(--text-md);
					}
				}
			}
		}
	}

	.mark-all {
		margin-top: 1rem;
		border-radius: 2px;
		height: 2rem;
		line-height: 2rem;
		text-align: center;
		cursor: pointer;
		background: var(--color-bg-2);

		&:hover {
			background: var(--color-bg-3);
		}
	}
	.notificationCentre{
		text-align: center;
		margin-top:2rem
	}
}
